{namespace lfe=SGalinski\Lfeditor\ViewHelpers}

<f:layout name="Default" />

<f:section name="selectItems">
	<f:form id="mainMenuForm" action="changeSelection">
		<h2 class="uppercase">
			<f:translate key="select.extension" />
		</h2>
		<f:form.select name="extensionSelection"
			value="{extensionSelection}"
			options="{extensionOptions}"
			additionalAttributes="{onchange: 'submitForm(\'mainMenuForm\')'}"
			/>
	</f:form>
</f:section>

<f:section name="main">
	<lfe:extendedIf condition="{extensionSelection}" and="{backups}">
		<h2 class="uppercase">
			<f:translate key="function.backupMgr.backupMgr" />
		</h2>
		<table id="tx-lfeditor-table">
			<thead>
				<tr>
					<th class="bgColor5">
						<f:translate key="function.backupMgr.date" />
					</th>
					<th class="bgColor5">
						<f:translate key="function.backupMgr.state" />
					</th>
					<th class="bgColor5">
						<f:translate key="lang.file.file" />
					</th>
					<th id="tx-lfeditor-table-markup1" class="bgColor5">
						<f:link.action action="deleteAllBackup"
							title="{f:translate(key: 'function.backupMgr.deleteAll')}">
							<img src="{f:uri.resource(path: 'Icons/garbage.png')}"
								alt="{f:translate(key: 'function.backupMgr.deleteAll')}">
						</f:link.action>
					</th>
					<th id="tx-lfeditor-table-markup2" title="{f:translate(key: 'function.backupMgr.recover')}">
						{recoverLabelThead}
					</th>
					<th id="tx-lfeditor-table-markup3" title="{f:translate(key: 'function.backupMgr.diff.diff')}">
						{differenceLabelThead}
					</th>
				</tr>
			</thead>
			<tbody>
				<f:for each="{backups}" as="backup">
					<tr>
						<td class="bgColor4">
							{backup.date}
						</td>
						<f:if condition="{backup.state} == 'function.backupMgr.ok'">
							<f:then>
								<td class="tx-lfeditor-goodMarkup bgColor4">
									<f:translate key="{backup.state}" />
								</td>
							</f:then>
							<f:else>
								<td class="tx-lfeditor-badMarkup bgColor4">
									<f:translate key="{backup.state}" />
								</td>
							</f:else>
						</f:if>
						<td class="bgColor4">
							{backup.langFile}
						</td>
						<td class="bgColor4">
							<f:link.action action="deleteBackup"
								arguments="{fileName: backup.fileName, langFile: backup.langFile}"
								title="{f:translate(key: 'function.backupMgr.delete')}">
								<img src="{f:uri.resource(path: 'Icons/garbage.png')}"
									alt="{f:translate(key: 'function.backupMgr.delete')}">
							</f:link.action>
						</td>
						<f:if condition="{backup.state} == 'function.backupMgr.ok'">
							<f:then>
								<td class="bgColor4">
									<f:link.action action="recoverBackup"
										arguments="{fileName: backup.fileName, langFile: backup.langFile}"
										title="{f:translate(key: 'function.backupMgr.recover')}">
										<img src="{f:uri.resource(path: 'Icons/recover.png')}"
											alt="{f:translate(key: 'function.backupMgr.recover')}">
									</f:link.action>
								</td>
								<td class="bgColor4">
									<f:link.action action="showDifferenceBackup"
										arguments="{fileName: backup.fileName, langFile: backup.langFile}"
										title="{f:translate(key: 'function.backupMgr.diff.diff')}">
										<img src="{f:uri.resource(path: 'Icons/diff.png')}"
											alt="{f:translate(key: 'function.backupMgr.diff.diff')}">
									</f:link.action>
								</td>
							</f:then>
							<f:else>
								<td class="bgColor4">[-]</td>
								<td class="bgColor4">[-]</td>
							</f:else>
						</f:if>
					</tr>
				</f:for>
			</tbody>
		</table>

		<f:if condition="{differences}">
			<fieldset class="tx-lfeditor-fieldset bgColor5">
				<legend class="bgColor3">
					<f:translate key="function.backupMgr.diff.diff" />
				</legend>
				<p class="tx-lfeditor-goodMarkup">
					xyz -- <f:translate key="function.backupMgr.diff.goodMarkupHint" />
				</p>
				<p class="tx-lfeditor-badMarkup">
					xyz -- <f:translate key="function.backupMgr.diff.badMarkupHint" />
				</p>

				<f:for each="{differences}" as="difference">
					<fieldset class="bgColor4">
						<legend class="bgColor3">
							{difference.legend}
						</legend>
						<ul class="tx-lfeditor-backups-label">
							<f:for each="{difference.constants}" as="constant">
								<li>
									<p class="{f:if(condition: '{constant.state} == 2', then: 'tx-lfeditor-goodMarkup')}{f:if(condition: '{constant.state} == 1', then: 'tx-lfeditor-badMarkup')}">
										{constant.label}
									</p>
									<ul class="tx-lfeditor-backups-value">
										<li>
											{constant.value}
										</li>
									</ul>
								</li>
							</f:for>
						</ul>
					</fieldset>
				</f:for>
			</fieldset>
		</f:if>
	</lfe:extendedIf>
</f:section>